$themes: (
  light: (
    appMainBgColor: #f1f1f1,
    bgColor: #fff,
    textColor: #212121,
    shadowColor: #eee,
    borderColor: #e6e6e6,
    hoverColor: #ecf5ff,
  ),
  dark: (
    appMainBgColor: #000,
    bgColor: #212121,
    textColor: #fff,
    shadowColor: #2e2d2d,
    borderColor: #424141,
    hoverColor: #18222c,
  )
);

$currentTheme: light;
@mixin useTheme() {
  @each $key, $value in $themes {
    $currentTheme: $key !global;
    html[class='#{$key}'] & {
      @content;
    }
  }
}

@function getVar($key) {
  $themeMap: map-get($themes, $currentTheme);
  @return map-get($themeMap, $key);
}
